<template>
	<view class="container">
		<cu-custom  :isBack="true">
			<block slot="backText"><text style="color:#ffffff">返回</text></block>
			<block slot="content"><text style="color:#ffffff">个人设置</text></block>
		</cu-custom>
		
		<view class="page-form">
			<u-form :model="formData" ref="usForm" label-width="250" :border-bottom="false"	:label-style="{fontSize:'15px',fontWeight:'600',paddingRight:'5px'}" label-align ="right">
                <text class="form_text">基本信息设置</text>
				<!-- <u-form-item label="账 号:" prop="seat" style="width:100%;float:left;clear:both;">
					{{formData.seat}}
				</u-form-item> -->
				
				<u-form-item label="姓 名:" prop="name" style="width:100%;float:left;clear:both;">
					<u-input v-model="formData.name" placeholder="请输入姓名" required></u-input>
				</u-form-item>
				
				<u-form-item label="外呼主叫号码:" prop="shownum" style="width:100%;float:left;clear:both;">
					<u-input v-model="formData.shownum" placeholder="请输入外呼主叫号码" ></u-input>
				</u-form-item>
				
				<u-form-item label="过期时间" prop="expire" style="display: none;">
					{{formData.expire}}
				</u-form-item>

				<u-button @click="$stopClicks.noMultipleClicks(submitForm)" shape="circle" :ripple="true" type="primary" style="margin-top: 35px;float:left;clear:both;width:100%;margin-bottom:20px;">提 交</u-button>
                
                <text class="form_text">功能设置</text>
                <u-form-item label="呼叫下一个方式:" style="float:left;clear:both;">
                	<u-radio-group v-model="nextType" @change="handleChangeCallNextType">
                		<u-radio v-for="(item, index) in callNextTypeData" :key="index" :name="item.value">
                			{{ item.name }}
                		</u-radio>
                	</u-radio-group>
                </u-form-item>
                
			</u-form>
		</view>

		<u-toast ref="uUserInfoToast" />
	</view>
</template>

<script>
	import {
		updateSeatInfo,
		getSeatInfo
	} from "@/api/auth.js"
	import {
		mapGetters,mapState
	} from "vuex"

	export default {
		computed: {
			...mapGetters(["userInfo","callNextType"]),
			...mapState({
				callNextType: state => state.app.callNextType
			})
		},
		data() {
			return {
				formData: {
					seat: "",
					name: ""
				},
                nextType:'call',
				callNextTypeData: [
					{
						name: '外呼',
						value:'call'
					},
					{
						name: '回拨',
						value:'back'
					},
					{
						name: 'SIP',
						value:'sip'
					}
				],
			}
		},
		onLoad() {
			this.getUserInfo();
		},
		methods: {
			getUserInfo() {
				
				this.formData = this.userInfo;
				
				// this.nextType = this.callNextType;
                this.nextType = (uni.getStorageSync("callNextType") == "" || uni.getStorageSync("callNextType") == null || uni.getStorageSync("callNextType") == undefined) ? 'call' : uni.getStorageSync("callNextType");
				
                console.log("nexttype",this.nextType,uni.getStorageSync("callNextType"));
			},
            
            //切换呼叫下一个方式
            handleChangeCallNextType(v){
                console.log("handleChangeCallNextType v",v);
                
                this.$store.dispatch("setCallNextType",v);
                
                uni.setStorageSync("callNextType",v);
            },
            
			submitForm() {
				let that = this;
				
				if(this.formData.name == ''){
					console.log("currentuserinfo formData",this.formData);
					this.$refs.uUserInfoToast.show({
						title: '请输入姓名！',
						type: 'error',
						duration: '3000'
					})
				}else{
					console.log("currentuserinfo 提交接口",this.formData);
					updateSeatInfo(this.formData).then((res) => {
						
						console.log("currentuserinfo 返回数据",res);
						if (res.data.code == 200) {
							uni.showToast({
								title: '提交成功',
								duration: 3000,
								success() {
                                    if(that.userInfo.seat != undefined && that.userInfo.seat != "" && that.userInfo.seat != null){
                                        getSeatInfo({seat:that.userInfo.seat}).then((ress) => {
                                            if (ress.data.code == 200) {
                                                that.$store.dispatch("setUserInfo", Object.assign({}, that.userInfo, ress.data.data))
                                            }
                                        })
                                    }

									setTimeout(() => {
										uni.navigateBack({
											delta: 1
										});
									}, 1000)
								}
							})
						} else {
							this.$refs.uUserInfoToast.show({
								title: res.data.msg,
								type: 'error',
								duration: '3000'
							})

						}
					}, (error) => {
						console.log(error);
					})
				}
			
            },

		},
		onReady() {
			// this.$refs.usForm.setRules(this.formRules);
		}
	}
</script>

<style>
.container {
	width: 100%;
	color: #333333;
	background-image: linear-gradient(to bottom, #075AFF, #ffffff);
	background-size: 100% 45%;
	background-repeat: no-repeat;
	background-position: top center;
	overflow-y: scroll;
}

.page-form{
    width:94%;
    float:left;
    clear:both;
    height:auto;
    padding-bottom:50px;
}

.form_text{
    font-size:16px;
    color: #4f4f4f;
    font-weight:bold;
    display: block;
    width:100%;
    float:left;
    clear:both;
    margin-top:20px;
    padding-left:8px;
    border-left:#075AFF 4px solid;
}
</style>